<form  clrForm clrLayout="horizontal">
    <clr-date-container>
        <label>{{'APP_SEARCH_BEGIN_DATE'|translate}}</label>
        <input type="date" clrDate name="searchBeginDate" [(ngModel)]="searchBeginDate">
    </clr-date-container>

    <clr-date-container>
        <label>{{'APP_SEARCH_END_DATE'|translate}}</label>
        <input type="date" clrDate name="searchEndDate" [(ngModel)]="searchEndDate">
    </clr-date-container>


    <clr-select-container>
        <label>{{'APP_LOG_LABEL'|translate}}</label>
        <select clrSelect class="clr-select" name="label" (change)="getLabelValues()" [(ngModel)]="label">
            <option *ngFor="let item of labels" [value]="item">{{item}}</option>
        </select>
    </clr-select-container>

    <clr-select-container>
        <label>{{'APP_LOG_LABEL_VALUE'|translate}}</label>
        <select clrSelect class="clr-select" name="value" [(ngModel)]="value">
            <option *ngFor="let item of values" [value]="item">{{item}}</option>
        </select>
    </clr-select-container>

    <button class="btn btn-primary" type="button"  (click)="refresh()">{{'APP_SEARCH'|translate}}</button>
</form>

<clr-datagrid [clrDgLoading]="loading">
    <clr-dg-column>{{'APP_EVENT_DATE'|translate}}</clr-dg-column>
    <clr-dg-column>{{'APP_MSG_CONTENT'|translate}}</clr-dg-column>
    <clr-dg-row *ngFor="let item of logs" [clrDgItem]="item">
        <clr-dg-cell>{{item.ts | date:'yyyy-MM-dd HH:mm:ss'}}</clr-dg-cell>
        <clr-dg-cell>{{item.info}}</clr-dg-cell>
    </clr-dg-row>
</clr-datagrid>



